<template>


        <div class="super_container">

                
            
                <!-- Home -->

                <!--包含头部和左侧菜单-->

                <myheader></myheader>
            
                
            
                <div id="boxes" class="boxes">
                    <div class="section_container">
                        <div class="container">
                            {{msg}}
                            <el-input v-model="name" placeholder="请输入账号" ></el-input>
                            <br><br>
                            <el-input v-model="password" placeholder="请输入密码" show-password></el-input>
                            <br><br>
                            <el-button v-on:click='getApiData_post'>登录</el-button>
                            <br><br>
                            <el-row>
                            第三方登录：
                            <el-button style="border:0">
                                <img v-on:click='getApi_get' src="../assets/images/sina.png" width="25" height="25" />
                            </el-button>
                            <el-button style="border:0">
                                <img v-on:click='getApi_qq' src="../assets/images/qq.png" width="25" height="25" />
                            </el-button>
                            </el-row>
                                                
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>
                            <br>


                        </div>
                    </div>
                </div>
               
            
                

                <myfooter></myfooter>
            
            
            </div>

      
</template>

       
      <script>



        import myheader from './header.vue'
        import myfooter from './footer.vue'
        import Cookies from 'js-cookie'
      
      export default {
        data () {
          return {
            password:'',
            name:'',
            msg: '',
            dataList:[],
            clicked:0,
            upath: '',
          result: '',
          uping:0
          
          }
        },
        components: {
        'myheader':myheader,
        'myfooter':myfooter
        },
        mounted:function(){

            this.common.get_menu();
            
        
      
      },
        methods:{
            changetest(index){
                this.clicked = index;
            },
            getApiData_get:function() {
             //设置请求路径
             var url  = this.base_url+"/LoginHandler";                
             // 发送请求:将数据返回到一个回到函数中
             var _this= this;
             // 并且响应成功以后会执行then方法中的回调函数
             this.axios.get(url,{
                params: { 
                    name: '',
                    passqord:''
             }
}).then(function(result) {

        console.log(result);
        //_this.name = result.data.message[0].name;
             });    
             },
        



        // 定义异步post方法 getApiData_post  =正常登陆
        getApiData_post:function(){
            // 定义url
            var url = this.base_url+'/LoginHandler';

            //定义中介
            var _this = this;
            //使用axios发送异步请求
            this.axios.post(url,this.qs.stringify({
                name:this.name,password:this.password}))
            .then(function(result){
                console.log(result);
                _this.msg=result.data.msg;
                if(result.data.status == 200){
                    Cookies.set('name',result.data.user_info.name),
                    Cookies.set('u_id',result.data.user_info.id),
                    localStorage.setItem('token',result.data.token)
                    _this.$router.push({path:'/'},
                    
                    )
                }
                
            });
            },

            // 第三方新浪微博
            getApi_get:function() {
             //设置请求路径
             var url  = this.base_url+"/sina";                
             // 发送请求:将数据返回到一个回到函数中
             var _this= this;
             // 并且响应成功以后会执行then方法中的回调函数
             this.axios.get(url
                ).then(function(result) {           
                console.log(result);
                window.location.href = result.data
        
                    });    
                    },
            
            
            
            // 第三方QQ登陆
            getApi_qq:function() {
             //设置请求路径
             var url  = this.base_url+"/Get_author_code";                
             // 发送请求:将数据返回到一个回到函数中
             var _this= this;
             // 并且响应成功以后会执行then方法中的回调函数
             this.axios.get(url
                ).then(function(result) {           
                console.log(result);
                window.location.href = result.data
        
                    });    
                    },



        
        
        },
    
        
      }
      
      
      </script>
       
      <style>
      
      
      
      </style>